<template>
<view>
	<uni-nav-bar background-color="#e32519" color="#fff" status-bar="true" fixed="true" @clickLeft="clickNavLeft()"
		@clickRight="clickNavRight()">
		<!-- 导航栏左侧插槽 -->
		<view slot="left" style="display: flex;justify-content: space-between;">
			<image style="width: 110rpx;height: 50rpx;" src="../../static/xuexi.png"></image>

		</view>
		<u-search height="50rpx" placeholder="每日科普" placeholderColor="#eceae9" bgColor="#ec857b" :animation="true"
			searchIconColor="#eceae9"></u-search>

		<!-- 右侧插槽 -->
<!-- 		<view style="width: 25%; margin-left: 30rpx;display: flex ;justify-content:space-between;">
			<view style="font-size: 8px;padding-top: 14rpx;">积分</view>
			<view style="padding: 22rpx 0 0 12rpx;font-size: 20px;">1253</view>
		</view> -->
		<view slot="right"><text style="font-size: 16px;">我的</text></view>
	</uni-nav-bar>
	     <u-tabs style="width:400px; background-color: #ffeee6;position:fixed;z-index: 1;" lineColor="red"
	     lineWidth="25"
	      lineHeight="2"  
	      activeStyle="color:red;" 
	      :list="list1" 
	      >
	         <view
	                 slot="right"
	                 style="padding-left: 4px;"
	                 @tap="$u.toast('插槽被点击')"
	         >
	             <u-icon
	                     name="list"
	                     size="21"
	                     bold
	             ></u-icon>
	         </view>
	     </u-tabs>
		 
		 
	<view style="padding: 50px 10px 0 " @click="open()"> <u-icon name="plus-circle-fill" color="#ff0a2a" size="30"></u-icon> 发布</view>
	<view style="padding-top: 20px;">
		<view><text  style="font-size:30px;">学习新思想</text></view>
		<image style="width: 100%;" src="../../static/444311747946414517.jpg"></image>
		
		<view>做一个新青年，为中华之崛起而奋斗</view>
	</view>
		
		<!-- 底部自定义导航-->
		<u-tabbar :value="value4" @change="name => value4 = name" :fixed="true" :placeholder="true"
			activeColor="#d81e06" :safeAreaInsetBottom="true" >
			<!-- 强国通 -->
			<u-tabbar-item text="强国通"  badge="3" @click="go1(text)">
				<image style="width: 40rpx;height: 40rpx;" slot="active-icon" src="../../static/tabbar/qgt2.png">
				</image>
				<image style="width: 40rpx;height: 40rpx;" class="u-page__item__slot-icon" slot="inactive-icon"
					src="../../static/tabbar/qgt.png"></image>
			</u-tabbar-item>
			<!-- 百灵 -->
			<u-tabbar-item text="百灵" @click="go2()">
				<image style="width: 40rpx;height: 40rpx;" slot="active-icon" src="../../static/tabbar/bl2.png"></image>
				<image style="width: 40rpx;height: 40rpx;" class="u-page__item__slot-icon" slot="inactive-icon"
					src="../../static/tabbar/bl.png"></image>
			</u-tabbar-item>
			<!-- 中间图标 -->
			<u-tabbar-item @click="go3()">
				<image style="width: 80rpx;height: 80rpx;" slot="active-icon" src="../../static/tab.png"></image>
				<image style="width: 80rpx;height: 80rpx;" class="u-page__item__slot-icon" slot="inactive-icon"
					src="../../static/tab_select.png"></image>
			</u-tabbar-item>
			<!-- 电视台 -->
			<u-tabbar-item text="电视台" @click="go4()">
				<image style="width: 40rpx;height: 40rpx;" slot="active-icon" src="../../static/tabbar/dst2.png">
				</image>
				<image style="width: 40rpx;height:40rpx;" class="u-page__item__slot-icon" slot="inactive-icon"
					src="../../static/tabbar/dst.png"></image>
			</u-tabbar-item>
			<!-- 电台 -->
			<u-tabbar-item text="电台" @click="go5()">
				<image style="width: 40rpx;height: 40rpx;" slot="active-icon" src="../../static/tabbar/dt2.png"></image>
				<image style="width: 40rpx;height: 40rpx;" class="u-page__item__slot-icon" slot="inactive-icon"
					src="../../static/tabbar/dt.png"></image>
			</u-tabbar-item>
		</u-tabbar>	
	 
</view>
</template>

<script>
	export default {
		data() {
			return {
				huati:"",
				value4: 2,
				list1: [{
					name: '推荐',
				}, {
					name: '要闻',
				}, {
					name: '新思想'
				}, {
					name: '北京'
				}, {
					name: '综合'
				}, {
					name: '融媒'
				}, {
					name: '实播'
				}, {
					name: '快闪'
				}, {
					name: '发布'
				}]
			}
		},
		methods: {
			async requestTpic() {
				uni.request({
					method: 'get',
					url: 'http://127.0.0.1:3000/huati',
					success: res => {
						this.huati = res.data,
							console.log(res.data)
					}
				})
			},
			click(item) {
				console.log('item', item);
				
			},
			open(){
				uni.navigateTo({
					url:"huati"
				})
			},
			go1() {
				uni.navigateTo({
					url:"../qgt/qgt"
				})
			},
			go2() {
				uni.navigateTo({
					url:"../bl/bl"
				})
				
			},
			go3() {
				uni.navigateTo({
					url:"../xuexi/xuexi"
				})
			},
			go4() {
				uni.navigateTo({
					url:"../dst/dst"
				})
			},
			go5() {
				uni.navigateTo({
					url:"../dt/dt"
				})
			}
			
		}
	}
</script>

<style>

</style>
